<template>
	<div>
		<van-nav-bar title="订单" left-text="返回" left-arrow @click-left="() => { $router.back() }" fixed />
		<div style="height: 45px;"></div>
		<!-- 地址 渲染 -->
		<van-address-list v-model="chosenAddressId" :list="list" :disabled-list="disabledList" default-tag-text="默认"
			@add="onAdd" @edit="onEdit" add-button-text="支付" @click="sumbit" />
		<!-- cell 单元格渲染 -->
		<van-cell-group>
			<van-cell title="订单时间" :value="orderdata.create_time" />
			<van-cell title="订单号：" :value="orderdata.orderId" />
			<van-cell title="订单名称：" :value="orderdata.product_code" />
			<van-cell title="订单价格：" :value="(orderdata.totalPrice / 100).toFixed(2) + '元'" />
			<van-cell title="用户姓名：" :value="orderdata.username" />
		</van-cell-group>
	</div>
</template>
<script setup>
import { ref } from 'vue';
import { useRoute } from 'vue-router';
const route = useRoute()
// 打印传过来的orderid是否存在
console.log(route.params.orderId)
// 导入订单的接口
import { getOrderApi } from '@/api/api';
// 定义渲染数据
let orderdata = ref([])
getOrderApi(route.params.orderId).then(res => {
	console.log('订单详情', res);
	orderdata.value = res.data.data
	// 支付信息 都在订单中
	paydata.value = {
		orderId: res.data.data.orderId,
		subject: res.data.data.product_code,
		totalPrice: res.data.data.totalPrice / 100
	}
})
// 定制地址栏信息的数据
const list = [
	{
		id: '1',
		name: '张三',
		tel: '13000000000',
		address: '浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室',
		isDefault: true,
	},
]
// 导入支付的接口
import { payApi } from '@/api/api';
// 定义舒服的数据
let paydata = ref([])
const sumbit = () => {
	payApi(paydata.value).then(res => {
		console.log('支付信息', res);
		// 打开支付宝页面
		window.open(res.data.data, '_blank')
	})
}

</script>

<style lang="scss" scoped>
.order {
	width: 350px;
	height: 300px;
	// background-color: #ccc;
	line-height: 25px;
	margin: auto;
}
</style>